* {
  box-sizing: border-box;
}

body {
  font-family: Arial;
  padding: 10px;
  width: 860px;
  background-image: url("body-img.png");
  line-height: 1.5; /* 添加基础行高 */
}

/* 头部标题 */
.header {
  padding: 2px;
  width: 860px;
  text-align: left;
  background: rgba(231, 227, 224, 0);
}

.header h1 {
  font-size: 24px;
  line-height: 1.2; /* 标题行高可以更紧凑 */
}

/* 文章卡片效果 */
.card {
  background-color: rgba(255, 255, 255, 0.397);
  padding: 20px;
  width: 860px;
  margin-top: 20px;
  font-size: 20px;
  font-family: 微软雅黑;
  word-break: break-all;
  line-height: 1.3; /* 比基础行高稍紧凑 */
}

.card h2 {
  font-size: 20px;
  font-family: 微软雅黑;
}

/* 底部 */
.footer {
  padding: 5px;
  text-align: center;
  width: 860px;
  background: rgba(240, 240, 233, 0);
  margin-top: 20px;
  font-style: italic;
  color: rgb(252, 5, 5);
}

pre {
  white-space: pre-wrap;
  word-wrap: break-word;
}
.markdown-content {
    max-width: 800px;
    margin: 0 auto;
    padding: 2rem;
    line-height: 1.2;
}

.markdown-content h3 {
    color: #2c3e50;
    border-bottom: 2px solid #3498db;
    padding-bottom: 0.3em;  /* 减少标题下边距 */
    margin: 0.8em 0 0.5em; /* 上 | 左右 | 下 */
    line-height: 1.3;
    font-size: 1.3em;
}

.markdown-content h4 {
    margin-top: 0.6em;
    margin-bottom: 0.5em;
    font-size: 1.1em;
}

.markdown-content ol, 
.markdown-content ul {
    padding-left: 1.2em;
    margin-top: 0.5em;      /* 减少列表整体上边距 */
    margin-bottom: 0.5em;   /* 减少列表整体下边距 */
}

/* 调整列表项间距 */
.markdown-content ol li, 
.markdown-content ul li {
    margin: 0.3em 0;
}

.markdown-content table {
    border-collapse: collapse;
    width: 100%;
}

.markdown-content td, .markdown-content th {
    border: 1px solid #ddd;
    padding: 8px;
}

.markdown-content li {
    white-space: pre-wrap;  /* 保持源代码换行逻辑 */
    margin-bottom: 0.3em;   /* 减少列表项间距 */
}

/* 如果使用p标签包裹列表项需要添加 */
.markdown-content li p {
    display: inline;        /* 防止自动换行 */
    margin: 0;              /* 清除默认外边距 */
    line-height: 1.4;
}

.markdown-content hr {
    margin: 1.2em 0;
    border: 0;
    border-top: 1px solid #ddd;
}
